<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数组</title>
</head>

<body>
    <script>
        // 1、数组声明
        let myArr = [];
        let myArr1 = new Array();

        let myArr2 = [1, 2, 3, 'JS'];
        let myArr3 = new Array(500, 200, 300, 'Javascript');

        console.log(myArr);
        console.log(myArr1);
        console.log(myArr2);
        console.log(myArr3);

        // 2、数组访问，索引
        console.log(myArr2[3]);
        myArr2[3] = "WEB前端";
        console.log(myArr2[3]);

        console.log(myArr2.length);
        console.log(myArr2[100]);
        myArr2[100] = "赋值第101个数";
        console.log(myArr2[100]);
        console.log(myArr2.length);

        console.log(myArr2[99]);

        // 3、数组遍历
        console.log("=========1===============");
        for (let i = 0; i < myArr2.length; i++) {
            if (myArr2[i] || myArr2[i] === 0) {
                console.log(i + " => " + myArr2[i]);
            }
        }

        console.log("=========2===============");

        for (let k in myArr3) {
            console.log(k);
        }

        console.log("=========3===============");

        for (let val of myArr3) {
            console.log(val);
        }

        console.log("=========4===============");

        function myPrint(x) {
            console.log(x);
        }
        myArr3.forEach(myPrint);

        myArr3.forEach(function (x) {
            console.log(x);
        });

        myArr3.forEach(x => {
            console.log(x);
        });

        // 4、数组常用方法
        console.log(myArr3);
        console.log(...myArr3);

        console.log(myArr3.toString());

        console.log(myArr3.join());
        console.log(myArr3.join('|'));

        myArr3.push('新元素')
        console.log(myArr3);

        console.log(myArr3.pop());
        console.log(myArr3);

        console.log(myArr3.shift());
        console.log(myArr3);

        myArr3.unshift(666);
        console.log(myArr3);

        myArr3.sort();
        console.log(myArr3);

        myArr3.reverse();
        console.log(myArr3);

        let newArr = myArr3.concat('HTML', 'CSS');
        console.log(newArr);

        console.log(newArr.slice(1, 4));
        console.log(newArr.slice(1, -1));

        newArr.push(300);
        console.log(newArr);
        console.log(newArr.indexOf(300));
        console.log(newArr.indexOf(888));
        console.log(newArr.lastIndexOf(300));

        // 5、高级方法
        let oldArr = [1, 2, 3, 4];
        newArr = oldArr.map(x => {
            return x * x;
        });

        console.log(newArr);

        newArr = oldArr.filter(x => {
            return x % 2 == 0;
        });
        console.log(newArr);

        let sum = oldArr.reduce((x, y) => {
            return x + y;
        });
        console.log(sum);

        let flag = oldArr.every(x => {
            return x > 3;
        });
        console.log(flag);

        let flag2 = oldArr.some(x => {
            return x > 3;
        });
        console.log(flag2);

    </script>
</body>

</html>